<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>Insert title here</title>
	<link rel="stylesheet" href="I:\UserManager\UserManager\src\main\webapp\resources\css\bootstrap\css\bootstrap.css"></script>
	<script src="I:\UserManager\UserManager\src\main\webapp\resources\js\angular\angular.js"></script>
	<script>
		var myModel = angular.module('myModel', []);
		myModel.controller('myCtrl', ['$scope', function($scope){
			$scope.sayHello=function(name){
				alert("Hello"+name);
			}
		}])

		myModel.directive('greeting', function(){
			return {
				scope: {greet:'&'}, 
				restrict: 'AE',
				template: '<input type="text" ng-model="username" /><br/>'+
				'<button class="btn btn-default" ng-click="greet({name:username})">Greet</button><br/>'
			};
		});

	</script>
	
</head>
<body ng-app="myModel">
	<div ng-controller="myCtrl">
		<greeting greet="sayHello(name)"></greeting>
		<greeting greet="sayHello(name)"></greeting>
		<greeting greet="sayHello(name)"></greeting>
	</div>

</body>
</html>